<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>

<!--script src="http://cdn.bootcss.com/jquery/3.0.0-rc1/jquery.min.js"></script-->
<script src="{{url_for('static', filename='layer/2.3/layer.js')}}"></script>
    <script src="{{url_for('static', filename='laypage/1.3/laypage/laypage.js')}}"></script>
    <script src="{{url_for('static', filename='laydate/1.1/laydate/laydate.js')}}"></script>
</head>

<body>
<button name="alter">信息</button>
<button id="info2">信息</button>
<button id="prompt">prompt</button>
<button id="confirm">询问框</button>
<button id="test1">小小提示层</button>
<a href="javascript:void(0);" id="about">关于</a>
<a href="javascript:void(0);" id=12 onclick="about()">删除</a>
<button id="alter">弹框</button>
<button name="alter">弹框1</button>
<button id="tab">Tab</button>


<table id="biuuu_city_list"></table>
<div id="biuuu_city"></div>
<div id="page11" style="margin-top:5px; text-align:center;"></div>
<div style="width:970px; margin:10px auto;" >
    测试时间：<input class="laydate-icon"  onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})"  placeholder="请输入日期"  name="stime">
</div>
<div style="width:970px; margin:10px auto;">
    开始时间：<input placeholder="请输入日期" class="laydate-icon" onclick="laydate()" name="stime"><br>
    结束时间：<input placeholder="请输入日期" class="laydate-icon" onclick="laydate()" name="dtime"><br>
    结束时间id：<input placeholder="请输入日期" class="laydate-icon" id="demo" name="stime"><br>
    结束时间：<input placeholder="请输入日期" class="laydate-icon" onclick="laydate({elem: '#demo'});" name="dtime"><br>
    演示二：<input class="laydate-icon" id="test2" value="2014-6-25更新"><br>
</div>
<div class="box">

</body>
<script>
function about(){
//询问框
var id=$(this).attr('id')
layer.confirm('您是否确定要删除？', {
  btn: ['确定','取消'] //按钮
}, function(){
  //$.get("/example/jquery/demo_test.asp",function(data,status){
    //  alert("数据：" + data + "\n状态：" + status);
    //});
  alert($(this).attr('id'));
  layer.msg('删除成功！', {icon: 7});
  window.location.href='www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&ch=&tn=baiduerr&bar=&wd=kkk';
}, function(){
  layer.msg('取消删除！', {icon: 1});
  window.location.href='http://www.baidu.com';
});
}
  $("button").click(function(){
    //$.get("/example/jquery/demo_test.asp",function(data,status){
    //  alert("数据：" + data + "\n状态：" + status);
    //});
	alert("提示：你确定删除吗？");
	$('#alter').on('click', function(){
        layer.msg('见到你真的很高兴', {icon: 2});
    })
  });

$("button[name=alter]").click(function(){
  alert($(this).html());
  alert('见到你真的很高兴');
});

$('#alter').on('click', function(){
	 //弹框
layer.alert('见到你真的很高兴');
});
</script>

<script>

laydate.skin('molv');
laydate({
   elem: '#demo'
})

</script>


<script>
laypage({
    cont: 'page11',
    pages: 18, //可以叫服务端把总页数放在某一个隐藏域，再获取。假设我们获取到的是18
    skin: 'yahei', //加载内置皮肤，也可以直接赋值16进制颜色值，如:#c00
    groups: 7, //连续显示分页数
    curr: function(){ //通过url获取当前页，也可以同上（pages）方式获取
        //var page = location.search.match(/page=(\d+)/);
        var page = location.search.match(/page\/(\d+)/);
        return page ? page[1] : 1;
    }(),
    jump: function(e, first){ //触发分页后的回调
        if(!first){ //一定要加此判断，否则初始时会无限刷新
            location.href = '/page/'+e.curr;
        }
    }
});
</script>

<script>
$('#alter').on('click', function(){
	 //弹框
layer.alert('见到你真的很高兴');
});


$('#alter1').on('click', function(){
	 //弹框1
layer.msg('见到你真的很高兴', {icon: 2});
});

$('#info').on('click', function(){
//信息框-例2
layer.msg('你确定你很帅么？', {
  time: 0 //不自动关闭
  ,btn: ['必须啊', '丑到爆']
  ,yes: function(index){
    layer.close(index);
    layer.msg('雅蠛蝶 O.o', {
      icon: 6
      ,btn: ['yes','no','unkonw']
    });
  }
});
});
$('#confirm').on('click', function(){
//询问框
layer.confirm('您是否确定要删除？', {
  btn: ['确定','取消'] //按钮
}, function(){

  layer.msg('删除成功！', {icon: 7});
  window.location.href='www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&ch=&tn=baiduerr&bar=&wd=kkk';
}, function(){
  layer.msg('取消删除！', {icon: 1});
  window.location.href='http://www.baidu.com';
});
});


$('#tab').on('click', function(){
//tab层
layer.tab({
  area: ['600px', '300px'],
  tab: [{
    title: 'TAB1',
    content: '内容1'
  }, {
    title: 'TAB2',
    content: '内容2'
  }, {
    title: 'TAB3',
    content: '内容3'
  }]
});
});

$('#prompt').on('click', function(){
//prompt层
layer.prompt({
  title: '输入任何口令，并确认',
  formType: 1 //prompt风格，支持0-2
}, function(pass){
  layer.prompt({title: '随便写点啥，并确认', formType: 2}, function(text){
    layer.msg('演示完毕！您的口令：'+ pass +' 您最后写下了：'+ text);
  });
});
});


$('#test1').on('click', function(){
//提示层
    layer.msg('Hello layer');
    });


$('#about').on('click', function(){
//关于
    layer.msg('玩命提示中');
    layer.alert(layer.v + ' - 贤心出品 sentsin.com');
    });

</script>
</html>